﻿{% extends 'base/front_base.html' %}
{% block title %}
	在线课堂详情 - 小饭桌
{% endblock %}

{% block head %}
	<link rel="stylesheet" href="{% static 'css/course/course_detail.min.css' %}">
{% endblock %}

{% block main %}
	<div class="main">
		<div class="course-nav">
			<div class="nav-container">
				<h3 class="title">在线课堂</h3>
				<ul class="nav-list">
					<li class="active"><a href="#">最新课堂</a></li>
					<li><a href="#">投资人说</a></li>
					<li><a href="#">明星案例</a></li>
					<li><a href="#">创业知识</a></li>
				</ul>
			</div>
		</div>
		<div class="wrapper">
			<div class="course-wrapper">
				<div class="course-info">

					<p class="course-title" course_id="{{ course.id }}">{{ course.title }}</p>

					<div class="sub-group">
						<div class="share-group"><span>分享至：</span></div>
						<div class="buy-group">
							{% if course.price == 0 %}

							<span class="free">免费</span>
							{% else %}
							<span class="price pay">{{ course.price }}元</span>
							<a href="{% url 'course:course_order' course_id=course.id %}" class="buy-btn">立即购买</a>
							{% endif %}
						</div>
					</div>
				</div>

				<div class="vedio-group">
					<video src="{{ course.video_url }}" controls="controls">
					</video>
				</div>
			</div>
			<div class="bottom-wrapper">
				<div class="course-detail-wrapper">
					<div class="item-group">
						<p class="item-title">{{ course.title }}</p>
						<div class="teacher-group">
							<div class="avatar-group">
								<img src="{% static 'images/teacher1.png'%}" alt="Alternate Text" />
							</div>
							<div class="teacher-info">
								<p class="teacher-name">{{ course.teacher }}</p>
								<p class="teacher-title">资深品牌公关</p>
							</div>
						</div>
						<p class="item-content">{{ course.teacher_desc }}</p>
					</div>
					<div class="item-group">
						<p class="item-title">课程简介</p>
						<p class="item-content">{{ course.course_desc }}</p>
					</div>
					<div class="item-group">
						<p class="item-title">课程大纲</p>
						<p class="item-content">
							{{ course.catalog }}
						</p>
					</div>
				</div>
				<div class="recommend_wrapper">
					<div class="title-group">
						<span class="title">推荐课程</span>
					</div>
					<ul class="recommend-list">
						<li>
							<div class="recommend-left">
								<p class="course-title"><a href="#">创业CEO如何避免技术决策错误</a></p>
								<p class="teacher">龚世海 /HiCTO创始人兼CEO</p>
							</div>
							<div class="recommend-right">
								<a href="#">
									<img src="{% static 'images/1589858493_664.png-website.news.list'%}" alt="Alternate Text">
								</a>
							</div>
						</li>
					</ul>
				</div>
			</div>

		</div>
	</div>
{% endblock %}




